<template>
  <div class="post_list_container bg-white p-5">
    <ArticleList :list="data" :pagination="pagination" @refresh="handleRefresh"></ArticleList>
  </div>
</template>

<script lang="ts" setup>
import { onMounted, watch } from 'vue'
import { useRoute } from 'vue-router'

const route = useRoute()

const typeId = computed(() => route.params.id as string)

const data = ref([])
const pagination = ref({
  pageSize: 10,
  pageNum: 1,
  total: 0,
})


const location = localStorage.getItem('location')?JSON.parse( localStorage.getItem('location') as string):{longitude:-1,latitude:-1}
const getData = async () => {
  const queryData = {
    type: Number(typeId.value)>0?typeId.value:undefined,
    x: Number(typeId.value)==-2?location.latitude:undefined,
    y: Number(typeId.value)==-2?location.longitude:undefined,
    pageSize: pagination.value.pageSize,
    pageNum: pagination.value.pageNum,
  }
  const result = await service.task.list(queryData)
  data.value = result.list
  pagination.value.total = result.total
}

onMounted(async () => {
  getData()
})

watch(typeId, () => {
  pagination.value.pageNum = 1
  getData()
})

const handleRefresh = (paginationInfo?: any) => {
  if (pagination) {
    pagination.value.pageSize = paginationInfo.pageSize
    pagination.value.pageNum = paginationInfo.pageNum
  }
  getData()
}
</script>


